<template>
    <div class="container">
        <el-tabs v-model="activeName" @tab-click="handleTab">
            <el-tab-pane label="视频监控" name="first" lazy>
                <v-hls :name="activeName"></v-hls>
            </el-tab-pane>
            <el-tab-pane label="回放记录" name="second"  lazy>
                <v-playBack :name="activeName"></v-playBack>
            </el-tab-pane>
        </el-tabs>
    </div>
</template>

<script>
    import videoPreView from './VideoPreView';
    import videoPreViewhls from './VideoPreViewhls';
    import videoPreViewflv from './VideoPreViewflv';
    import playBack from './PlayBack';
    export default {
        components: {
            'v-videoPreView': videoPreView,
            'v-flv': videoPreViewflv,
            'v-hls': videoPreViewhls,
            'v-playBack': playBack
        },
        data() {
            return {
                activeName: 'first',
                permission_map: {},
                is_superuser: false
            }
        },
        created() {

        },
        methods: {
            handleTab(tab, event) {
                this.activeName = tab.name;
            }
        }
    }
</script>

<style >
</style>
